<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>${fns:getConfig('productName')} 登录</title>
    <meta name="decorator" content="blank"/>
	<style type="text/css">
        .div-signin{
            position:relative;text-align:center;width:396px;
            padding:25px 29px 29px;
            margin-top: 30%;
            margin-right: 10%;
            margin-bottom: 0px;
            margin-left: 0px;
            background-color:#F0F0F0;border:1px solid #e5e5e5;
        }
		.nav-signin{
			position:relative;
			width:396px;
			background-color:#FFFFFF;border:1px solid #e5e5e5;
		}
        .form-signin{position:relative;text-align:left;width:396px;padding:25px 29px 29px;
            margin-top: 0px;
            margin-right: 10%;
            margin-bottom: 20px;
            margin-left: auto;
            background-color:#FFFFFF;border:1px solid #e5e5e5;
        }
        .form-signin .checkbox{margin-bottom:10px;color:#0663a2;} .form-signin .input-label{font-size:16px;line-height:23px;color:#999;}
        .form-signin .input-block-level{font-size:16px;height:auto;margin-bottom:15px;padding:9px;width: 270px}
        .form-signin .btn.btn-large{font-size:16px;} .form-signin #themeSwitch{position:absolute;right:15px;bottom:10px;}
        .form-signin div.validateCode {padding-bottom:15px;} .mid{vertical-align:middle;}
        label.error{font-size: 12px;width:200px;}
        .link-text{
            font: 14px "SimHei", "PT Sans Narrow", Arial, sans-serif;
            color: #FFFFFF;
        }
        .logo-text{
            font: 28px "SimHei", "PT Sans Narrow", Arial, sans-serif;
            color: #2C3E50;
        }
        .message-text{
            font: 24px "SimHei", "PT Sans Narrow", Arial, sans-serif;
            color: #565E69;
        }
        .button-text{
            font: 20px "SimHei", "PT Sans Narrow", Arial, sans-serif;
            color: #FFFFFF;
        }
    </style>
	<script type="text/javascript">
		$(document).ready(function() {
			$("#loginForm").validate({
				rules: {
					validateCode: {remote: "${pageContext.request.contextPath}/servlet/validateCodeServlet"}
				},
				messages: {
					username: {required: "请填写用户名."},password: {required: "请填写密码  ."},
					validateCode: {remote: "验证码不正确.", required: "请填写验证码."}
				},
				errorLabelContainer: "#messageBox",
				errorPlacement: function(error, element) {
					error.appendTo($("#loginError").parent());
				}
			});
		});
		// 如果在框架或在对话框中，则弹出提示并跳转到首页
		if(self.frameElement && self.frameElement.tagName == "IFRAME" || $('#left').length > 0 || $('.jbox').length > 0){
			alert('未登录或登录超时。请重新登录，谢谢！');
			top.location = "${ctx}";
		}
		function login(obj){
			//$("#btnDiv").style.background-image = '../static/images/login-btn-down.png';
            if($("#username").val() == "" && $("#password").val()){
                $("#messageBox").css('display', 'block');
            }
			$("#loginForm").submit();
		}

		function sydwlogin(obj){
			$("#sydwloginForm").submit();
		}
		// 获取短信验证码
		function getSmsCode() {
			$.get("${pageContext.request.contextPath}/f/apifront/sendSms", function (data) {
				if(data.code == "SUCC") {
					top.$.jBox.tip(data.message, 'info');
				}
			});
		}
	</script>
</head>
<body>
<div class="container-fluid">
	<div class="header">
	</div>
	<div class="row text-right " style="background-color:#2C3E50;height:40px">
        <div class="col-md-10">.col-md-4</div>
        <div class="col-md-2"><p style="color: #fff;padding-top: 10px;padding-right: 10px;">设为首页 | 加入收藏</p></div>
	</div>
	<div class="row text-left" style="background-color:#FFFFFF;height: 60px">
		<div class="col-md-5  logo-text" style="padding-top: 5px">
			<%--<img src="${ctxStatic}/images/LOGO.png">--%>
			${fns:getConfig('productName')}
		</div>
	</div>
	<div class="row" <%--style=" background: #292F34 url('${ctxStatic}/images/login-bg.jpg') no-repeat;background-size: 100% 100%;height: 700px"--%>>
        <div class="col-md-8"></div>
        <div class="col-md-3">
			<div class="div-signin message-text"> 系统登录
                <div id="messageBox" class="alert alert-info" style="display: ${empty message ? 'none' : ''}">
                    <label id="loginError" class="error">${message}</label>
                </div>
			</div>
			<!-- Custom Tabs -->
			<div class="nav-tabs-custom nav-signin">
				<ul class="nav nav-tabs">
					<li style="width:100%" class="active"></li>
					<%--<li <c:if test="${empty orgtype}">class="active"</c:if> style="width:100%"><a href="#tab_1" data-toggle="tab">维保单位登录</a></li>--%>
					<%--&lt;%&ndash;<li <c:if test="${orgtype eq '2'}">class="active"</c:if> style="width:47%"><a href="#tab_2" data-toggle="tab">使用单位登录</a></li>&ndash;%&gt;--%>
					<%--<li style="width:1%"> </li>--%>
				</ul>
				<div class="tab-content">
					<div class="tab-pane active" id="tab_1">
						<form id="loginForm" action="${ctx}/login" method="post">
							<input type="hidden" name="orgtype" value="1"/>
							<!--
                            <div class="input-prepend input-append">
                                <input type="text" id="orgcode" name="orgcode" class="input-block-level" placeholder="组织机构代码" >
                                <span class="add-on" style="height: 30px;"><img src="../static/images/login-orgcode.png"  title="组织机构代码"/> </span>
                            </div>
                            -->
							<div class="form-group has-feedback">
								<input type="text" id="username" name="username" class="form-control required" value="${username}" placeholder="登录名" >
								<span class="glyphicon form-control-feedback" style="top:8px;;height: 30px;background-image:url(${ctxStatic}/images/login-name.png);background-repeat:no-repeat;"></span>
							</div>
							<div class="form-group has-feedback">
								<input type="password" id="password" name="password" class="form-control required" placeholder="密码">
								<span class="glyphicon form-control-feedback" style="top:8px;;height: 30px;background-image:url(${ctxStatic}/images/login-pwd.png);background-repeat:no-repeat;"></span>
							</div>
							<c:if test="${isValidateCodeLogin}"><div class="validateCode">
								<label class="input-label mid" for="validateCode">验证码</label>
								<sys:validateCode name="validateCode" inputCssStyle="margin-bottom:0;"/>
							</div></c:if>
							<button class="btn btn-primary btn-block"  onclick="login(this)">登录</button>
							<div class="text-right" style="padding-top: 10px">
								<label for="rememberMe" title="下次不需要再登录"><input type="checkbox" id="rememberMe" name="rememberMe" ${rememberMe ? 'checked' : ''}/> 记住我（公共场所慎用）</label>
							</div>
						</form>
					</div>
					<!-- /.tab-pane -->
					<%--<div class="tab-pane" id="tab_2">
						<form id="sydwloginForm" action="${pageContext.request.contextPath}/f/sydwfront/sydwlogin" method="post">
							<input type="hidden" name="orgtype" value="2"/>
							<!--
                            <div class="input-prepend input-append">
                                <input type="text" id="orgcode" name="orgcode" class="input-block-level" placeholder="组织机构代码" >
                                <span class="add-on" style="height: 30px;"><img src="../static/images/login-orgcode.png"  title="组织机构代码"/> </span>
                            </div>
                            -->
							<div class="form-group has-feedback">
								<input type="text" name="username" class="form-control required" value="${username}" placeholder="登录名">
								<span class="glyphicon form-control-feedback" style="top:8px;;height: 30px;background-image:url(${ctxStatic}/images/login-name.png);background-repeat:no-repeat;"></span>
							</div>
							<div class="form-group has-feedback">
								<input type="password" name="password" class="form-control required" placeholder="密码">
								<span class="glyphicon form-control-feedback" style="top:8px;;height: 30px;background-image:url(${ctxStatic}/images/login-pwd.png);background-repeat:no-repeat;"></span>
							</div>
							<!--
							<div class="input-group input-group">
								<input type="text" name="smscode" class="form-control required" value="${smscode}" placeholder="验证码">
								<span class="input-group-btn">
								  <button type="button" class="btn btn-info btn-flat" onclick="getSmsCode();">获取验证码</button>
								</span>
							</div>
							-->
							<button class="btn btn-primary btn-block"  onclick="sydwlogin(this)">登录</button>
						</form>
					</div>--%>
				</div>
					<!-- /.tab-pane -->
				</div>
				<!-- /.tab-content -->
			</div>
			<!-- nav-tabs-custom -->
		</div>
        <div class="col-md-1"></div>
	</div>
	<div class="row text-center" style="background-color:#2C3E50;height:64px">
		<div class="col-md-12 link-text" style="padding-top: 32px;color: #fff;">
			关于我们 | 常见问题 | 帮助中心 | 联系我们
		</div>
	</div>
	<div class="row text-center" style="background-color:#2C3E50;height:40px">
		<div class="col-md-12 link-text" style="padding-top: 10px;color: #fff;">
			版权所有  &copy; 深圳市卓越信息技术有限公司 2015-2016，保留一切权利。
		</div>
	</div>
</div>
</body>
</html>